<%= javascript_include_tag :defaults %>
<script type="text/javascript" src="/javascripts/MathJax/MathJax.js">
MathJax.Hub.Config({
        extensions: ["tex2jax.js",],
        jax: ["input/TeX", "output/HTML-CSS"],
        tex2jax: {
            inlineMath: [ ['$','$'], ["\\(","\\)"] ],
        },
        "HTML-CSS": {
            scale: 100,
        }
    });
</script>
<script type="text/javascript">
function update()
{
    new Ajax.Updater('messages', '/chat/update/' + <%= @user.id %>, {asynchronous:true, evalScripts:true, insertion:'bottom' });
    return false;
}
function scroll_down()
{
    $('messages').scrollTop = 1000000;
}
setInterval("update()", 2000);
document.observe("dom:loaded", scroll_down());
</script>

<h3 align="center">Welcome to the Room <%=h @user.name %></h3>

<div id="messages" class="scrollbox">
<% @messages.each do | msg | %>
   <%= msg.user.name %> says: <%= msg.text %><br/>
<% end %>
</div>

<br/>
Note: Here's a <a href="http://en.wikibooks.org/wiki/LaTeX/Mathematics" target="_blank">Latex Commands</a> List and Tutorial.

<table width="100%">
<tr>
<td width="70%">
    <% remote_form_for @message, :url => '/chat/create_message', :update => "messages", :position => :bottom do |f| %>
    <p>
        <%= f.hidden_field :user_id, :value => @user.id %><br />
        <%= f.label :text, 'Message' %><br />
        <%= f.text_area :text, :rows => 5, :class => "message_area" %>
        </p>
        <p>
        <%= f.submit 'Post' %>
    </p>
</td>
<td>
    <p>Just type <span class="tex2jax_ignore">\[ \int_0^\infty e^{-x}\,dx \] </span> to renderice:</p>
    \[
     \int_0^\infty e^{-x}\,dx
    \]
</td>
</tr>
</table>

<% end %>

